<template>
	<view>
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="content">学校介绍</block>
		</cu-custom>
		
		<view class="school_name">
			<view class="flex school_box">
				<view class="schoolBox_imag">
					<block>
						<view v-if="logo!=''">
							<image :src="logo" class="minSchool_img" ></image>
						</view>
						<view class="minSchoolText" v-if="logo==''">{{school_name[0]}}</view>
					</block>
				</view>
				
				<view class="school_text">
					<view class="schol_name"><text>{{school_name}}</text></view>
					<view class="schol_title"><text>这里是学校描述副标题</text></view>
				</view>
				
			</view>
		</view>
		
		<view class="school_content">
			
			<view class="select_box flex">
				<view @tap="select_school(1)">
					<view class="text"  :class="a==1?'text_content':'school_environment'" >学校介绍</view>
					<view class="text_border"  :style="a==1?'':'background-color: #ffffff;'"></view>
				</view>
				<view @tap="select_school(2)">
					<view class=" font_left text"  :class="a==2?'text_content':'school_environment'">学校环境</view>
					<view class="text_schoolborder"  :style="a==2?'background-color: #3b73f6;':''"></view>
				</view>
			</view>
			
			<view class="school_listbox" v-if="a==true">
				<view class="flex list_box">
					<view class="schoolname_box"><text>学校名称</text></view>
					<view class="schoolname_select">
						<view style="text_school">
							{{school_name}}
						</view>
					</view>
				</view>
				
				<view class="flex list_box">
					<view class="schoolname_box"><text>学校地址</text></view>
					<view class="flex schoolname_select">
						<view style="text_school">
							{{address}}
						</view>
					</view>
				</view>
				
				<view class="flex list_box">
					<view class="schoolname_box"><text>联系电话</text></view>
					<view class="flex schoolname_select" @tap="call(phone)">
						<view style="text_school">
							{{phone}}
						</view>
					</view>
					<view class="iconfont icon-you1 icon_box"></view>
				</view>
				
				<view class="flex list_box">
					<view class="schoolname_box"><text>院长</text></view>
					<view class="flex schoolname_select">
						<view style="text_school">
							{{principal}}
						</view>
					</view>
				</view>
				
				<view class="set_a"> 
					<view class="schoolname_box">学院设置</view>
				</view>
				<view class="but_listbox">
					<view class="button_box" v-for="(item,index) in branch_sys" :key='index'>{{item}}</view>
				</view>
				
				<view v-if="!this.token && this.identity != 'student'">
				<!-- <view v-if="this.identity == 'student1'"> -->
					<view class="but_box" v-if="result==0">
						<button class="btn" @tap="showModal" data-target="bottomModal" >申请合作</button>
					</view>
					
					<view class="but_box" v-if="result==1">
						<button class="btn" >申请中</button>
					</view>
					
					<view class="but_box" v-if="result==2">
						<button class="btn" >已合作</button>
					</view>
				</view>
			</view>
			
			<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
				<view class="cu-dialog">
					<view class="modal_box">
						<view class="control_box flex">
							<view class="apply_text">申请合作</view>
							<text class="cancel_text iconfont icon-guanbi" @tap="hideModal"></text>
						</view>
						<view class="imput_information">
							<view class="input_box flex">
								<text class="iconfont icon-weibiaoti562 person_box"></text>
								<text class="linkman">联系人</text>
								<input placeholder="请输入您的姓名" style="margin-left: 58rpx; text-align: left;" v-model="new_contacts"/>
							</view>
							<view class="input_box input_phone flex">
								<text class="iconfont icon-shoujihao person_box"></text>
								<text class="linkman">手机号</text>
								<input placeholder="请输入您的手机号" style="margin-left: 58rpx; text-align: left;" v-model="new_phone"/>
							</view>
							<view>
								<button class="button_apply" @tap="applay_info()">立即申请</button>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<view v-if="a==2" class="school_listbox">
				<view class="imagelist flex">
						<image v-if="item!=null" v-for="(item,index) in images" :key='index' :src="item" class="image_box" @tap="previewImage(item)" mode="aspectFill"></image>
						<view class="nodata" v-if="images==null">暂无信息</view>
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const { 
		appLogin,
		httpGet,
		httpPost
	} = require("@/utils/common.js")
	export default {
		data() {
			return {
				branch_sys:[],
				logo:'',
				a: true,
				index: 0,
				identity:'',
				school_id:0,
				new_school_id:0,
				school_name:'',
				address:'',
				phone:'',
				contacts:'',
				new_contacts:'',
				new_phone:121212,
				principal:'',
				modalName: null,
				result:0,
				images:[],
				token:'',
				company_id:0
			}
		},
		onLoad(option) {
			appLogin((user_info)=>{
				console.log(option)
				console.log(user_info)
				this.token = user_info.token
				this.identity = user_info.identity
				console.log(this.token,this.identity)
				this.school_id = option.school_id
				if(!this.school_id){
					uni.showToast({
						icon:"none",
						title:"访问错误"
					})
					return setTimeout(()=>{uni.navigateBack()},2000) 
				}
				this.companyinfo()
				this.school_more()
				this.displayinfo()
			})
		},
		methods: {
			companyinfo(){
				httpGet({
					url: '/api/company/my_staff',
				}).then(res => {
					console.log(res)
					this.company_id = res.result.company_id
					httpGet({
						url:'/api/company/info',
						data:{
							company_id:this.company_id
						}
					}).then((res) => {
						this.new_contacts = res.result.contacts
						this.new_phone = res.result.phone
					})
				})
			},
			previewImg(logo){
				var arr = []
				arr.push(logo)
				uni.previewImage({
					current:0,
					urls: arr,
				})
			},
			// 拨打电话
			call(phone){
				uni.makePhoneCall({
				    phoneNumber: phone 
				});
			},
			previewImage(current){
				console.log(current)
				uni.previewImage({
					current,
					urls: this.images
				})
			},
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target
			},
			hideModal(e) {
				this.modalName = null
			},
			PickerChange(e) {
				this.index = e.detail.value
			},
			select_school(a){
				this.a = a
				console.log(this.a)
			},
			displayinfo(){
				console.log(this.school_id)
				httpGet({
					url:'/api/company/cooperate_school_info',
					data:{
						school_id:this.school_id
					}
				}).then(res => {
					console.log(res)
					this.result = res.result
					console.log(this.result)
				})
			},
			school_more(){
				httpGet({
					url:'/api/school/info',
					data:{
						school_id:this.school_id,
					}
				}).then(res => {
					console.log(res)
					this.school_name = res.result.school_name,
					this.address = res.result.address,
					this.phone = res.result.phone,
					this.contacts = res.result.contacts,
					this.principal = res.result.principal,
					this.logo  = res.result.logo
					this.branch_sys = res.result.branch_sys
					this.images = res.result.images
				})
			},
			applay_info(){
				httpGet({
					url:'/api/company/cooperate_school',
					data:{
						school_id:this.school_id,
						contacts:this.new_contacts,
						phone:this.new_phone
					}
				}).then(res => {
					console.log(res)
					this.hideModal()
					this.result = 0
					this.displayinfo()
				})
			},
		}
	}
</script>

<style>
	.nodata{
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 100rpx;
		margin: auto;
		font-size: larger;
	}
	.font_left{
		margin-left: 147rpx;
	}
	
	.school_name{
		height: 260rpx;
		background-color: #3b73f6;
	}
	
	.school_box{
		padding-top: 50rpx;
		padding-left: 45rpx;
	}
	
	.schoolBox_imag{
		width: 115rpx;
		height: 115rpx;
		border-radius: 180rpx;
		background-color: #3b73f6;
	}
	
	.minSchool_img{
		width: 115rpx;
		height: 115rpx;
		border-radius: 180rpx;
	}
	
	.school_text{
		margin-left: 35rpx;
		padding-top: 15rpx;
	}
	
	.schol_name{
		font-size: 30rpx;
		color: #FFFFFF;
		margin-bottom: 10rpx;
	}
	
	.schol_title{
		font-size: 22rpx;
		color: #d2dbfc;
	}
	
	.school_content{
		height: 1130rpx;
		background-color: #FFFFFF;
		border-radius: 30rpx 30rpx 0 0;
		margin-top: -27rpx;
	}
	
	.select_box{
		padding-left: 70rpx;
		padding-top: 70rpx;
	}
	
	.text_content{
		font-size: 31rpx;
		color: #3b73f6;
		font-weight: bold;
	}
	
	.text{
		font-size: 31rpx;
		color: #3b73f6;
	}
	
	.text_border{
		width: 80rpx;
		height: 8rpx;
		background-color: #3b73f6;
		margin-left: 20rpx;
		border-radius: 90rpx;
		margin-top: 25rpx;
	}
	
	.school_environment{
		color: #666666;
		font-size: 31rpx;
	}
	
	.text_schoolborder{
		width: 80rpx;
		height: 8rpx;
		background-color: #FFFFFF;
		margin-left: 170rpx;
		border-radius: 90rpx;
		margin-top: 25rpx;
	}
	
	.school_listbox{
		margin-top: 50rpx;
	}
	
	.list_box{
		height: 92rpx;
		border-bottom-style: solid;
		border-color: #fafafa;
		border-width: 4rpx;
		padding-left: 30rpx;
		line-height: 90rpx;
		position: relative;
		justify-content: space-between;
		padding-right: 55rpx;
	}
	
	.schoolname_box{
		font-size: 30rpx;
		color: #666666;
	}
	
	.schoolname_select{
		right: 20rpx;
		margin-left: 200rpx;
		text-align: right;
	}
	
	.text_school{
		color: #333333;
		font-size: 26rpx;
	}
	
	.icon_box{
		color: #999999;
		font-size: 26rpx;
		margin-left: 20rpx;
		position: absolute;
		right: 20rpx;
	}
	
	.set_a{
		height: 92rpx;
		padding-left: 30rpx;
		line-height: 90rpx;
	}
	
	.button_box{
		background-color: #759df9;
		color: #FFFFFF;
		font-size: 28rpx;
		text-align: center;
		height: 55rpx;
		border-radius: 10rpx;
		line-height: 55rpx;
		padding-left: 15rpx;
		padding-right: 15rpx;
		margin-right: 20rpx;
		margin-bottom: 20rpx;
	}
	
	.but_listbox{
		margin-left: 30rpx;
		display: flex;
		flex-flow: row wrap;
	}
	
	.imagelist{
		margin: auto;
		margin-top: 30rpx;
		margin-left: 45rpx;
		width: 690rpx;
		flex-flow: row wrap;
	}
	
	.image_box{
		width: 210rpx;
		height: 210rpx;
		margin-bottom: 15rpx;
		margin-right: 15rpx;
	}
	
	.but_box{
		height: 98rpx;
		width: 100%;
		background-color: #FFFFFF;
		border-top-width: 1rpx;
		border-top-color: #e6e6e6;
		line-height: 98rpx;
		position: absolute;
		bottom: 0;
		padding-top: 13rpx;
	}
	
	.btn{
		height: 70rpx;
		width: 690rpx;
		border-radius: 90rpx;
		background-color: #3b73f6;
		text-align: center;
		line-height: 70rpx;
		color: #FFFFFF;
		font-size: 30rpx;
	}
	
	.modal_box{
		height: 697rpx;
	}
	
	.control_box{
		margin-top: 35rpx;
	}
	
	.apply_text{
		font-size: 31rpx;
		color: #333333;
		font-weight: bold;
		margin-left: 314rpx;
	}
	
	.cancel_text{
		font-size: 26rpx;
		color: #c6c6c6;
		margin-left: 245rpx;
		margin-top: 7rpx;
	}
	
	.imput_information{
		margin-top: 58rpx;
	}
	
	.input_box{
		width: 684rpx;
		margin: auto;
		border-style: solid;
		border-color: #e5e5e5;
		border-width: 2rpx;
		height: 105rpx;
		border-radius: 10rpx;
		padding: 33rpx 25rpx;
	}
	
	.input_phone{
		margin-top: 25rpx;
	}
	
	.person_box{
		font-size: 35rpx;
		color: #3b73f6;
		margin-top: 2rpx;
	}
	
	.linkman{
		margin-left: 15rpx;
		font-size: 30rpx;
		color: #333333;
	}
	
	.input_name{
		margin-left: 58rpx;
	}
	
	.button_apply{
		width: 688rpx;
		margin: auto;
		margin-top: 180rpx;
		background-color: #3b73f6;
		color: #FFFFFF;
		font-size: 30rpx;
		text-align: center;
		line-height: 98rpx;
		height: 98rpx;
		border-radius: 15rpx;
	}
	
	.minSchoolText{
		width: 115rpx;
		height: 115rpx;
		border-radius: 180rpx;
		background-color: #FFFFFF;
		text-align: center;
		line-height: 115rpx;
	}
</style>
